import React, {Component} from 'react';
import {View, StyleSheet, Text, Image, ImageBackground} from 'react-native';
import {Flex, WingBlank, List, Tabs, Modal, Toast} from '@ant-design/react-native';
import {getBankApplyList, setApplyState, setContractState, setBankPayState, getApplyInfo} from '~/api/bank';
import Item from '@ant-design/react-native/lib/list/ListItem';

class MyLoanDetails extends Component {
    static navigationOptions = {
        headerTransparent: true,
        headerTintColor: 'white',
    };
    constructor(props) {
        super(props);
        this.state = {
            BankApplyID: this.props.navigation.getParam('BankApplyID'),
            list: '',
            identity: this.props.navigation.getParam('identity'),
            params: this.props.navigation.getParam('params'),
            orderid: this.props.navigation.getParam('orderid'),
        };
        this.GetList();
    }
    GetList() {
        getApplyInfo(this.state.BankApplyID).then((r) => {
            if (r.code === 0) {
                this.setState({
                    list: r.data,
                });
            } else {
                Toast.info(r.msg, 1);
            }
        });
    }
    AuditOrder(ParkingOrderID, state) {
        Modal.alert('提示', '确认' + (state === 1 ? '通过' : '不通过') + '该订单？', [
            {
                text: '取消',
            },
            {
                text: state === 1 ? '通过' : '不通过',
                onPress: () => {
                    if (state != 1) {
                        this.props.navigation.push('Feedback', {state: state, ParkingOrderID: ParkingOrderID});
                    } else {
                        setApplyState({
                            id: ParkingOrderID,
                            state: state,
                            // content: this.state.text,
                        }).then((r) => {
                            if (r.code === 0) {
                                this.GetList();
                            } else {
                                Toast.info(r.msg);
                            }
                        });
                    }
                },
            },
        ]);
    }
    FaceOrder(ParkingOrderID) {
        Modal.alert('提示', '确认面签通过该订单？', [
            {
                text: '取消',
            },
            {
                text: '通过',
                onPress: () => {
                    setContractState({
                        id: ParkingOrderID,
                    }).then((r) => {
                        if (r.code === 0) {
                            this.GetList();
                        } else {
                            Toast.info(r.msg);
                        }
                    });
                },
            },
        ]);
    }
    LendingOrder(ParkingOrderID) {
        Modal.alert('提示', '确认放款成功？', [
            {
                text: '取消',
            },
            {
                text: '确认',
                onPress: () => {
                    setBankPayState({
                        id: ParkingOrderID,
                    }).then((r) => {
                        if (r.code === 0) {
                            this.GetList();
                        } else {
                            Toast.info(r.msg);
                        }
                    });
                },
            },
        ]);
    }
    render() {
        return (
            <View style={{flex: 1}}>
                <View style={{flex: 1}}>
                    <ImageBackground
                        style={{width: '100%', height: 230, resizeMode: 'repeat', justifyContent: 'center', alignItems: 'center'}}
                        source={require('~/assets/public/juxing.png')}>
                        <View style={{width: '100%', marginRight: '10%', alignItems: 'flex-end', marginTop: -40}}>
                            <Text
                                onPress={() => {
                                    this.props.navigation.push('PayLoan', {
                                        params: this.state.params,
                                        orderid: this.state.orderid,
                                    });
                                }}
                                style={{
                                    backgroundColor: 'rgba(255,255,255,0.2)',
                                    color: 'white',
                                    borderRadius: 40,
                                    width: 80,
                                    height: 30,
                                    textAlign: 'center',
                                    paddingTop: 5,
                                }}>
                                查看资料
                            </Text>
                        </View>
                        <Text style={{color: 'white', fontSize: 30, fontWeight: 'bold'}}>￥{this.state.list.LoanPrice}</Text>
                        <Text style={{color: 'white', marginTop: 10, fontSize: 14}}>
                            购买{this.state.list.BuildingName}
                            {this.state.list.ParkingName}车位的贷款金额
                        </Text>
                    </ImageBackground>
                    <WingBlank size="lg">
                        {this.state.list.ApplyState === 4 ? (
                            <View style={{backgroundColor: 'white', flexDirection: 'row', borderRadius: 10, marginTop: -50, height: 300, alignItems: 'center', justifyContent: 'center'}}>
                                <Text style={{fontSize: 18, fontWeight: 'blod'}}>贷款订单已取消</Text>
                            </View>
                        ) : (
                            <View style={{backgroundColor: 'white', flexDirection: 'row', borderRadius: 10, marginTop: -50}}>
                                <Flex direction="column" style={{height: '100%', marginTop: 35}}>
                                    {this.state.list.OrderContractState === 1 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Image style={{width: 13, height: 13}} source={require('~/assets/community/dagou.png')} />
                                            </View>
                                        </View>
                                    ) : (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>1</Text>
                                            </View>
                                        </View>
                                    )}
                                    {this.state.list.ApplyState === 1 || this.state.list.ApplyState === 7 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 2,
                                                    height: 50,
                                                    backgroundColor: '#1BA1FF',
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Image style={{width: 13, height: 13}} source={require('~/assets/community/dagou.png')} />
                                            </View>
                                        </View>
                                    ) : this.state.list.OrderContractState === 1 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <Image
                                                style={{width: 2, height: 50, alignItems: 'center', justifyContent: 'center', marginLeft: 33}}
                                                source={require('~/assets/community/gantan.png')}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>2</Text>
                                            </View>
                                        </View>
                                    ) : (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 2,
                                                    height: 50,
                                                    backgroundColor: '#DDDDDD',
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#DDDDDD',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>2</Text>
                                            </View>
                                        </View>
                                    )}
                                    {this.state.list.ContractState === 1 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 2,
                                                    height: 50,
                                                    backgroundColor: '#1BA1FF',
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Image style={{width: 13, height: 13}} source={require('~/assets/community/dagou.png')} />
                                            </View>
                                        </View>
                                    ) : this.state.list.ApplyState === 1 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <Image
                                                style={{width: 2, height: 50, alignItems: 'center', justifyContent: 'center', marginLeft: 33}}
                                                source={require('~/assets/community/gantan.png')}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>3</Text>
                                            </View>
                                        </View>
                                    ) : (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 2,
                                                    height: 50,
                                                    backgroundColor: '#DDDDDD',
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#DDDDDD',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>3</Text>
                                            </View>
                                        </View>
                                    )}
                                    {/* {this.state.PayState === 1
                                    ?
                                    <View style={{ alignItems: 'center', justifyContent: 'center' }}>
                                        <View style={{ width: 2, height: 50, backgroundColor: '#1BA1FF', alignItems: 'center', justifyContent: 'center', marginLeft: 33 }}></View>
                                        <View style={{ width: 20, height: 20, backgroundColor: '#1BA1FF', borderRadius: 40, alignItems: 'center', justifyContent: 'center', marginLeft: 33 }}>
                                            <Image style={{ width: 13, height: 13 }} source={require('~/assets/community/dagou.png')} />
                                        </View>
                                    </View>
                                    : (this.state.ContractState === 1
                                        ?
                                        <View style={{ alignItems: 'center', justifyContent: 'center' }}>
                                            <Image style={{ width: 2, height: 50, alignItems: 'center', justifyContent: 'center', marginLeft: 33 }} source={require('~/assets/community/gantan.png')}></Image>
                                            <View style={{ width: 20, height: 20, backgroundColor: '#1BA1FF', borderRadius: 40, alignItems: 'center', justifyContent: 'center', marginLeft: 33 }}>
                                                <Text style={{ width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center' }}>4</Text>
                                            </View>
                                        </View>
                                        :
                                        <View style={{ alignItems: 'center', justifyContent: 'center' }}>
                                            <View style={{ width: 2, height: 50, backgroundColor: '#DDDDDD', alignItems: 'center', justifyContent: 'center', marginLeft: 33 }}></View>
                                            <View style={{ width: 20, height: 20, backgroundColor: '#DDDDDD', borderRadius: 40, alignItems: 'center', justifyContent: 'center', marginLeft: 33 }}>
                                                <Text style={{ width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center' }}>4</Text>
                                            </View>
                                        </View>
                                    )
                                } */}
                                    {this.state.list.PayState === 1 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 2,
                                                    height: 50,
                                                    backgroundColor: '#1BA1FF',
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Image style={{width: 13, height: 13}} source={require('~/assets/community/dagou.png')} />
                                            </View>
                                        </View>
                                    ) : this.state.list.ContractState === 1 ? (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <Image
                                                style={{width: 2, height: 50, alignItems: 'center', justifyContent: 'center', marginLeft: 33}}
                                                source={require('~/assets/community/gantan.png')}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#1BA1FF',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>4</Text>
                                            </View>
                                        </View>
                                    ) : (
                                        <View style={{alignItems: 'center', justifyContent: 'center'}}>
                                            <View
                                                style={{
                                                    width: 2,
                                                    height: 50,
                                                    backgroundColor: '#DDDDDD',
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}
                                            />
                                            <View
                                                style={{
                                                    width: 20,
                                                    height: 20,
                                                    backgroundColor: '#DDDDDD',
                                                    borderRadius: 40,
                                                    alignItems: 'center',
                                                    justifyContent: 'center',
                                                    marginLeft: 33,
                                                }}>
                                                <Text style={{width: 13, height: 18, color: 'white', fontSize: 12, textAlign: 'center'}}>4</Text>
                                            </View>
                                        </View>
                                    )}
                                </Flex>
                                <Flex direction="column" align="start">
                                    <Flex style={{marginTop: 20}}>
                                        {/* <View style={{ width: 20, height: 20, backgroundColor: '#1BA1FF', borderRadius: 40, alignItems: 'center', justifyContent: 'center', marginLeft: 33 }}>
                                    <Image style={{ width: 13, height: 13 }} source={require('~/assets/community/dagou.png')} />
                                </View> */}
                                        <View style={{flexDirection: 'column', marginLeft: 20, width: '80%'}}>
                                            <Text>银行审核</Text>
                                            <Text style={{color: '#999999', marginTop: 5}}>您的贷款资料已提交，等待银行审核</Text>
                                        </View>
                                    </Flex>
                                    <Flex style={{marginTop: 20}}>
                                        <View style={{flexDirection: 'column', marginLeft: 20, width: '80%'}}>
                                            {this.state.list.ApplyState === 7 ? (
                                                <Text>审核未通过</Text>
                                            ) : this.state.list.ApplyState === 1 ? (
                                                <Text>审核通过</Text>
                                            ) : (
                                                <Text>正在审核中</Text>
                                            )}
                                            <Text style={{color: '#999999', marginTop: 10}}>
                                                {this.state.list != '' &&
                                                    (this.state.list.log.length === 0
                                                        ? this.state.list.ApplyState === 1
                                                            ? '您的贷款资料已通过银行审核，等待银行面签'
                                                            : '正在审核中，请等待'
                                                        : this.state.list.log[0].LogContent)}
                                            </Text>
                                        </View>
                                    </Flex>
                                    <Flex style={{marginTop: 20}}>
                                        <View style={{flexDirection: 'column', marginLeft: 20, width: '80%'}}>
                                            {this.state.list.ContractState === 1 ? <Text>银行面签</Text> : <Text>银行面签(未签)</Text>}
                                            <Text style={{color: '#999999', marginTop: 10}}>
                                                {this.state.list.ContractState === 1 ? '您的面签已成功通过' : '您的面签未通过'}
                                            </Text>
                                        </View>
                                    </Flex>
                                    <Flex style={{marginTop: 20, marginBottom: 20}}>
                                        <View style={{flexDirection: 'column', marginLeft: 20, width: '80%'}}>
                                            {this.state.list.PayState === 1 ? <Text>放款成功</Text> : <Text>放款失败</Text>}
                                            <Text style={{color: '#999999', marginTop: 10}}>
                                                {this.state.list.PayState === 1 ? '放款成功' : '等待放款'}
                                            </Text>
                                        </View>
                                    </Flex>
                                </Flex>
                            </View>
                        )}
                    </WingBlank>
                    <View style={{width: '100%', justifyContent: 'space-around', flexDirection: 'row', marginTop: 20}}>
                        {this.state.identity === 21 &&
                            this.state.list.OrderState === 1 &&
                            this.state.list.OrderPayID > 0 &&
                            this.state.list.DepositState === 1 &&
                            this.state.list.OrderContractState === 1 &&
                            this.state.list.ApplyState === 6 &&
                            this.state.list.ContractState === 0 && (
                                <>
                                    <Text
                                        onPress={() => {
                                            this.AuditOrder(this.state.list.BankApplyID, 1);
                                        }}
                                        style={{
                                            width: '40%',
                                            backgroundColor: 'red',
                                            padding: 5,
                                            color: 'white',
                                            borderRadius: 5,
                                            textAlign: 'center',
                                        }}>
                                        {' '}
                                        通过
                                    </Text>
                                    <Text
                                        onPress={() => {
                                            this.AuditOrder(this.state.list.BankApplyID, 7);
                                        }}
                                        style={{
                                            width: '40%',
                                            backgroundColor: 'red',
                                            padding: 5,
                                            color: 'white',
                                            borderRadius: 5,
                                            textAlign: 'center',
                                        }}>
                                        不通过
                                    </Text>
                                </>
                            )}
                        {this.state.identity === 21 &&
                            this.state.list.OrderState === 1 &&
                            this.state.list.OrderPayID > 0 &&
                            this.state.list.DepositState === 1 &&
                            this.state.list.OrderContractState === 1 &&
                            this.state.list.ApplyState === 1 &&
                            this.state.list.ContractState === 0 && (
                                <Text
                                    onPress={() => {
                                        this.FaceOrder(this.state.list.BankApplyID);
                                    }}
                                    style={{width: '80%', backgroundColor: 'red', padding: 5, color: 'white', borderRadius: 5, textAlign: 'center'}}>
                                    面签通过
                                </Text>
                            )}
                        {this.state.identity === 21 &&
                            this.state.list.ApplyState === 1 &&
                            this.state.list.PayState === 0 &&
                            this.state.list.ContractState === 1 && (
                                <Text
                                    onPress={() => {
                                        this.LendingOrder(this.state.list.BankApplyID);
                                    }}
                                    style={{width: '80%', backgroundColor: 'red', padding: 5, color: 'white', borderRadius: 5, textAlign: 'center'}}>
                                    贷款发放
                                </Text>
                            )}
                    </View>
                </View>
            </View>
        );
    }
}
export default MyLoanDetails;
